<template>
  <div id="main">
  </div>
</template>

<script>
import E from "wangeditor"
export default {
  name: "WangEditor",
  props: {

  },
  data() {
    return {
      editor: null,
    }
  },
  mounted() {
    //创建wangeditor实例
    this.editor = new E('#main');
    // 配置 onchange 回调函数 --获取值
    this.editor.config.onchange = (newHtml) => {
      // console.log("change 之后最新的 html", newHtml);
      this.$emit("sendEditor", newHtml)
    };
    // 配置触发 onchange 的时间频率，默认为 200ms
    this.editor.config.onchangeTimeout = 500; // 修改为 500ms
    this.editor.config.menus = [//所有菜单
      'head',
      'bold',
      'fontSize',
      'fontName',
      'italic',
      'underline',
      'strikeThrough',
      'indent',
      'lineHeight',
      'foreColor',
      'backColor',
      'link',
      // 'list',
      // 'todo',
      // 'justify',
      'quote',
      'emoticon',
      'image',
      'video',
      'table',
      'code',
      'splitLine',
      'undo',
      'redo',
    ]
    //为了优化饿了么窗口遮罩层默认是10000
    this.editor.config.zIndex = 11
    //占位字符
    this.editor.config.placeholder = '来试试找出有关富文本编辑器的bug'
    // 取消自动 focus
    this.editor.config.focus = false
    this.editor.create();
  },
  methods: {
    clear() {
      this.editor.txt.clear();
    },
    setHTML(val) {
      this.editor.txt.html(val)
    }
  }
}
</script>

<style lang="less" scoped>

</style>
